<template>
   <!-- <swiper class="swiper" :options="swiperOption">
    <swiper-slide><img src="../../../assets/images/home/banner1.jpg" /></swiper-slide>
    <swiper-slide><img src="../../../assets/images/home/banner2.jpg" /></swiper-slide>
    <swiper-slide><img src="../../../assets/images/home/banner3.jpg" /></swiper-slide>
    <swiper-slide><img src="../../../assets/images/home/banner4.jpg" /></swiper-slide>
    <div class="swiper-pagination" slot="pagination"></div>
    <div class="swiper-button-prev" slot="button-prev"></div>
    <div class="swiper-button-next" slot="button-next"></div>
  </swiper> -->

  <div>
    <swiper class="swiper" :options="swiperOption">
        <swiper-slide v-for="item in $store.state.adv.focusList" :key="item.id"><img :src="'/huang'+item.imgUrl"></swiper-slide>
        <div class="swiper-pagination" slot="pagination"></div>
        <div class="swiper-button-prev" slot="button-prev"></div>
        <div class="swiper-button-next" slot="button-next"></div>
    </swiper>
  </div>

</template>

<script>
import { Swiper, SwiperSlide } from 'vue-awesome-swiper'
import 'swiper/css/swiper.css'
import axios from 'axios'
  export default {
    name:'BannerSwiper',
    components: {
      Swiper,
      SwiperSlide
    },
    data() {
      return {
        focusList:[],
        swiperOption: {
          spaceBetween: 30,
          centeredSlides: true,
          autoplay: {
            delay: 2500,
            disableOnInteraction: false
          },
          pagination: {
            el: '.swiper-pagination',
            clickable: true
          },
          navigation: {
            nextEl: '.swiper-button-next',
            prevEl: '.swiper-button-prev'
          }
        }
      }
    },
    mounted(){
      // axios.get("http://huangfasheng.com:1314/focusList").then((result)=>{
      //   console.log(result);
      //   this.focusList = result.data
      // })


      // axios.get("/huang/focusList").then((result)=>{
      //   console.log(result.data.focusList);
      //   this.focusList = result.data.focusList
      // })

      this.$store.dispatch("adv/getFocusListAsync");
    }
}

</script>

<style scoped>
  
</style>